<template>
  <div class="films-box">
    <div class="list-name">
      <div class="title">{{ $route.query.typeName }}</div>
    </div>
    <div class="content-list">
      <!-- 电影展示组件 -->
      <div class="film-item" v-for="film in films" :key="film.filmId">
        <div class="film-img">
            <img :src="film.filmImg" alt="">
          </div>
          <div class="film-title">{{ film.filmName }}</div>
          <!-- 评分组件 -->
          <film-source :source="film.source"></film-source>
      </div>
    </div>
  </div>
</template>

<script>
export default {
    data(){
        return {
            films:[]
        }
    },
    mounted(){
        let params = {
            typeId:this.$route.query.typeId,
            size:9
        }
        this.$api.loadFilmsByParams(params)
            .then(res => {
                this.films = res
            })
    }
};
</script>

<style>
</style>